<template>
  <div class="editBranchBox" style="width: 800px; margin-top: 20px">
    <h4 style="padding-left: 100px; margin-bottom: 10px">
      媒体报道/新增媒体报道
    </h4>
    <el-form
      :model="ruleForm"
      :rules="rules"
      ref="ruleForm"
      label-width="280px"
      class="demo-ruleForm"
    >
      <el-form-item label="报道标题:" prop="mediaTitle">
        <el-input v-model="ruleForm.mediaTitle"></el-input>
      </el-form-item>
      <el-form-item label="媒体:" prop="mediaName">
        <el-input v-model="ruleForm.mediaName"></el-input>
      </el-form-item>
      <el-form-item label="设置默认时间:">
        <div class="block" prop="mediaTitle">
          <el-date-picker
            v-model="ruleForm.mediaTime"
            type="datetime"
            placeholder="选择日期时间"
            default-time="12:00:00"
            style="width:100%"
          >
          </el-date-picker>
        </div>
      </el-form-item>

      <el-form-item label="报道链接:" prop="mediaUrl">
        <el-input v-model="ruleForm.mediaUrl"></el-input>
      </el-form-item>
      <el-form-item label="排序:" prop="mediaSort">
        <el-input v-model="ruleForm.mediaSort"></el-input>
      </el-form-item>

      <el-form-item>
        <el-button @click="$router.push({name:'ReportMediaManages'})">取消</el-button>
        <el-button type="primary" @click="addMedia()"
          >保存</el-button
        >
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
export default {
  data() {
    return {
      // mediaTime:"",
      ruleForm: {
        mediaTitle: "",
        mediaName: "",
        mediaUrl: "",
        mediaSort: "",
        mediaTime:""
       
      },
      rules: {
        mediaTitle: [{ required: true, message: "请输入报道标题", trigger: "blur" }],
        mediaName: [{ required: true, message: "请输入媒体名称", trigger: "blur" }],
        mediaUrl: [{ required: true, message: "请输入报道链接", trigger: "blur" }],
        mediaSort: [{ required: true, message: "请输入序号", trigger: "blur" }],
      },
    };
  },
  methods: {
    async addMedia() {
      //   1 表单的验证
      //   2 验证通过后 发送请求
      //   3 发送请求成功后关闭弹框  重新刷新页面

      // this.ruleForm.location = `${this.provAndCity.city},${this.provAndCity.province}`
      //  1 表单的验证
      let success = await this.$refs["ruleForm"].validate().catch(() => {});
      console.log(success);

      if (!success) return false;
      // 2 验证通过后 发送请求
      let {
        meta: { status },
      } = await this.$http.getAddMedia(this.ruleForm);
        // console.log(data);
      if (status == 200) {
        this.$message.success("添加成功");

        // 重新刷新页面
        this.$router.push({name:'ReportMediaManages'})
      }
    },
  },
};


</script>

<style>
</style>